{{- /*
@returns {template.HTML}

@examples

  {{< spi >}}Lorem ipsum dolor sit amet, consectetur adipiscing elit.{{< /spi >}}
*/ -}}

{{- $id := ((printf "sc-%s-%s" ($.Name) (delimit (shuffle (seq 11 99)) "")) | md5) -}}

<span id="sc-{{ ($id) }}" class="shortcode shortcode-{{ ($.Name) }}"><span class="d-inline"><i class="fas fa-question-circle fa-fw"></i></span><span class="d-none">{{ ((.Inner) | markdownify) }}</span></span>

<script>
  (() => {
    const $id = document.getElementById('sc-{{ ($id) }}');
    const $icon = $id.querySelector('span:first-child').classList;
    const $text = $id.querySelector('span:last-child').classList;
    $id.addEventListener('click', ($e) => {
      if ($icon.contains('d-inline')) {
        $icon.replace('d-inline', 'd-none');
      } else if ($icon.contains('d-none')) {
        $icon.replace('d-none', 'd-inline');
      }
      if ($text.contains('d-none')) {
        $text.replace('d-none', 'd-inline');
      } else if ($text.contains('d-inline')) {
        $text.replace('d-inline', 'd-none');
      }
    });
  })();
</script>

{{- /* This comment removes trailing newlines. */ -}}
